<%@ page language="java" pageEncoding="ISO-8859-1"%>
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%>
<%@ taglib uri="http://richfaces.org/a4j" prefix="a4j"%>
<%@ taglib uri="http://richfaces.org/rich" prefix="rich"%>

<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
	<base href="<%=basePath%>">

		<title>CON-011: Production Control System [Output]</title>

		<meta http-equiv="pragma" content="no-cache">
		<meta http-equiv="cache-control" content="no-cache">
		<meta http-equiv="expires" content="0">
		<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
		<meta http-equiv="description" content="This is my page">

		<link rel="stylesheet" type="text/css" href="./css/custom.css">


	</head>

	<body>
		<f:view>
			<f:loadBundle var="bundle"
				basename="com.tpc.control.message.ResourceBundle" />
			<h:form id="con011Form">
				<h:outputText value="Production Control System" styleClass="headerText"/>	
				<h:commandButton action="back010" value="Back"/>
				<h:panelGroup styleClass="panelRight">
					<h:outputText value="Last Updated: " style="font-weight: bold"/>
					<h:outputText value="#{con010.lastUpdate}">
						<f:convertDateTime pattern="dd.MM.yyyy hh:mm:ss" locale="th_TH"/>
					</h:outputText>
				</h:panelGroup>
				<rich:datascroller for="commonTable"></rich:datascroller>
				<rich:dataTable binding="#{con010.dataTable}" id="commonTable" onRowMouseOver="this.style.backgroundColor='#F1F1F1'"
				onRowMouseOut="this.style.backgroundColor='#{a4jSkin.tableBackgroundColor}'" />
				
					

				
				<!--<rich:scrollableDataTable binding="#{con010.productionTable}"
					selection="#{con010.selection}" />-->
				<h:panelGrid columns="2" columnClasses="info,info">
					<rich:simpleTogglePanel style="width: 200px" switchType="client">
						<f:facet name="header">
							<h:outputText value="Output Information" />
						</f:facet>
						<h:panelGrid columns="2" style="font-size: 11px">
							<h:outputText value="Total Line: " />
							<h:panelGroup>
								<h:outputText value="#{con010.totalLine}" />
								<h:outputText value=" records" />
							</h:panelGroup>
						</h:panelGrid>
					</rich:simpleTogglePanel>
					<rich:simpleTogglePanel style="width: 400px" switchType="client" opened="false">
						<f:facet name="header">
							<h:outputText value="Status Information" />
						</f:facet>
						<h:panelGrid columns="3" style="font-size: 11px">
							<h:outputText value="#{con010.totalRed}" />
							<h:graphicImage value="/images/status/red.gif" />
							<h:outputText value="#{bundle.warning01}" />
							<h:outputText value="#{con010.totalOrange}" />
							<h:graphicImage value="/images/status/orange.gif" />
							<h:outputText value="#{bundle.warning02}" />
							<h:outputText value="#{con010.totalYellow}" />
							<h:graphicImage value="/images/status/yellow.gif" />
							<h:outputText value="#{bundle.warning03}" />
							<h:outputText value="#{con010.totalPink}" />
							<h:graphicImage value="/images/status/pink.gif" />
							<h:outputText value="#{bundle.warning04}" />
							<h:outputText value="#{con010.totalViolet}" />
							<h:graphicImage value="/images/status/violet.gif" />
							<h:outputText value="#{bundle.warning05}" />
							<h:outputText value="#{con010.totalGreen}" />
							<h:graphicImage value="/images/status/green.gif" />
							<h:outputText value="#{bundle.warning06}" />
							<h:outputText value="#{con010.totalWhite}" />
							<h:graphicImage value="/images/status/white.gif" />
							<h:outputText value="#{bundle.warning07}" />
						</h:panelGrid>
					</rich:simpleTogglePanel>
				</h:panelGrid>


			</h:form>

			<rich:modalPanel id="routingPanel" autosized="false"
				keepVisualState="false" width="600" height="550">
				<f:facet name="header">
					<h:outputText value="Production Detail" />
				</f:facet>
				<f:facet name="controls">
					<h:panelGroup>
						<h:graphicImage value="/images/modal/close.png"
							id="closeRotuinglink" />
						<rich:componentControl for="routingPanel"
							attachTo="closeRotuinglink" operation="hide" event="onclick" />
					</h:panelGroup>
				</f:facet>
				<h:panelGroup>
					<rich:panel id="routingOutputPanel">
						<h:panelGrid columns="6" border="0" style="font-size: 11px">
							<h:outputText value="Production No:" styleClass="headerSubject"/>
							<h:outputText value="#{con010.selectedCommon.id.productionNo}" />
							<h:outputText value="Seq:" styleClass="headerSubject"/>
							<h:outputText value="#{con010.selectedCommon.id.seq}" />
							<h:outputText value="Quantity:" styleClass="headerSubject"/>
							<h:outputText value="#{con010.selectedCommon.quantity} #{con010.selectedCommon.uom}" />
							<h:outputText value="Sale Order:" styleClass="headerSubject"/>
							<h:outputText value="#{con010.selectedCommon.saleData.id.saleOrder}: #{con010.selectedCommon.saleData.id.saleItem}" />
							<h:outputText value="Customer:" styleClass="headerSubject"/>
							<h:outputText value="#{con010.selectedCommon.customer}: #{con010.selectedCommon.customerName}"/>
							<h:outputText value="Customer PO.:" styleClass="headerSubject"/>
							<h:outputText value="#{con010.selectedCommon.customerPoNo}" />
							<h:outputText value="PIR No./ PO Inter No.:" styleClass="headerSubject"/>
							<h:outputText value="#{con010.selectedCommon.pirNo}" />
							<h:outputText value="PIR Due Date./ PO Inter Due Date:" styleClass="headerSubject"/>
							<h:outputText value="#{con010.selectedCommon.pirDueDate}">
								<f:convertDateTime pattern="dd.MM.yyyy" locale="th_US"/>
							</h:outputText>
							<h:outputText value="Material" styleClass="headerSubject"/>
							<h:outputText value="#{con010.selectedCommon.material}" />
							<h:outputText value="Design No. FG" styleClass="headerSubject"/>
							<h:outputText value="#{con010.selectedCommon.designNoFg}" />
							<h:outputText value="Curr. Oper.:" styleClass="headerSubject"/>
							<h:outputText value="#{con010.selectedCommon.currentOperation}" />
							<h:outputText value="User Status:" styleClass="headerSubject"/>
							<h:outputText value="#{con010.selectedCommon.userStatus}" />
							<h:outputText value="Tot Product Qty:" styleClass="headerSubject"/>
							<h:outputText value="#{con010.selectedCommon.totProduceQty}" />
							<h:outputText value="Finish Goods:" styleClass="headerSubject"/>
							<h:outputText value="#{con010.selectedCommon.finishGoods}" />
							<h:outputText value="Sale Order Due Date:" styleClass="headerSubject"/>
							<h:outputText value="#{con010.selectedCommon.dueDate}">
								<f:convertDateTime pattern="dd.MM.yyyy" locale="th_US"/>
							</h:outputText>
							<h:outputText value="Greige Due Date:" styleClass="headerSubject"/>
							<h:outputText value="#{con010.selectedCommon.greigeDueDate}">
								<f:convertDateTime pattern="dd.MM.yyyy" locale="th_US"/>
							</h:outputText>
							<h:outputText value="Plan Greige:" styleClass="headerSubject"/>
							<h:outputText value="#{con010.selectedCommon.planGreige}" />
							<h:outputText value="Actual Greige:" styleClass="headerSubject"/>
							<h:outputText value="#{con010.selectedCommon.actualGreige}">
								<f:convertDateTime pattern="dd.MM.yyyy" locale="th_US"/>
							</h:outputText>
							<h:outputText value="Plan Start Date:" styleClass="headerSubject"/>
							<h:outputText value="#{con010.selectedCommon.planStartDate}">
								<f:convertDateTime pattern="dd.MM.yyyy" locale="th_US"/>
							</h:outputText>
							<h:outputText value="Plan Finish Date:" styleClass="headerSubject"/>
							<h:outputText value="#{con010.selectedCommon.planFinishDate}">
								<f:convertDateTime pattern="dd.MM.yyyy" locale="th_US"/>
							</h:outputText>
							<h:outputText value="Start Date:" styleClass="headerSubject"/>
							<h:outputText value="#{con010.selectedCommon.startDate}">
								<f:convertDateTime pattern="dd.MM.yyyy" locale="th_US"/>
							</h:outputText>
							<h:outputText value="Dye Remark:" styleClass="headerSubject"/>
							<h:outputText value="#{con010.selectedCommon.dyeRemark}" />
						</h:panelGrid>
						<rich:scrollableDataTable value="#{con010.selectedCommon.routings}" var="routing" width="450px" height="200px" id="routingTable">
							<rich:column width="200px">
								<f:facet name="header">
									<h:outputText value="Operation" />
								</f:facet>
								<h:outputText value="#{routing['name']}" />
							</rich:column>
							<rich:column width="250px">
								<f:facet name="header">
									<h:outputText value="Data" />
								</f:facet>
								<h:outputText value="#{routing['data']}" />
							</rich:column>
						</rich:scrollableDataTable>
					</rich:panel>
				</h:panelGroup>

			</rich:modalPanel>
			
			<rich:modalPanel id="saleOrderPanel" autosized="false"
				keepVisualState="false" width="600" height="550">
				<f:facet name="header">
					<h:outputText value="Sale Order Detail" />
				</f:facet>
				<f:facet name="controls">
					<h:panelGroup>
						<h:graphicImage value="/images/modal/close.png"
							id="closeSalelink" />
						<rich:componentControl for="saleOrderPanel"
							attachTo="closeSalelink" operation="hide" event="onclick" />
					</h:panelGroup>
				</f:facet>
				<h:panelGroup>
					<rich:panel id="saleOrderOutputPanel">
						<h:panelGrid columns="6" border="0" style="font-size: 11px">
							<h:outputText value="Sale Order:" styleClass="headerSubject"/>
							<h:outputText value="#{con010.selectedCommon.saleData.id.saleOrder}" />
							<h:outputText value="Sale Line Item:" styleClass="headerSubject"/>
							<h:outputText value="#{con010.selectedCommon.saleData.id.saleItem}" />
							<h:outputText value="Distr.:" styleClass="headerSubject"/>
							<h:outputText value="#{con010.selectedCommon.distrChannel}" />
							<h:outputText value="Customer Name:" styleClass="headerSubject"/>
							<h:outputText value="#{con010.selectedCommon.customerName}" />
							<h:outputText value="Customer PO:" styleClass="headerSubject"/>
							<h:outputText value="#{con010.selectedCommon.customerPoNo}" />
							<h:outputText value="Division:" styleClass="headerSubject"/>
							<h:outputText value="#{con010.selectedCommon.division}" />
							<h:outputText value="Sale Order Due Date:" styleClass="headerSubject"/>
							<h:outputText value="#{con010.selectedCommon.dueDate}">
								<f:convertDateTime pattern="dd.MM.yyyy" locale="th_US"/>
							</h:outputText>
							<h:outputText value="PIR / PO Inter No.:" styleClass="headerSubject"/>
							<h:outputText value="#{con010.selectedCommon.pirNo}" />
							<h:outputText value="PIR / PO Inter Due Date:" styleClass="headerSubject"/>
							<h:outputText value="#{con010.selectedCommon.pirDueDate}">
								<f:convertDateTime pattern="dd.MM.yyyy" locale="th_US"/>
							</h:outputText>
							<h:outputText value="Material:" styleClass="headerSubject"/>
							<h:outputText value="#{con010.selectedCommon.material}" />
							<h:outputText value="Design No. FG:" styleClass="headerSubject"/> 
							<h:outputText value="#{con010.selectedCommon.designNoFg}" />
							<h:outputText value="Due Submit Date:" styleClass="headerSubject"/>
							<h:outputText value="#{con010.selectedCommon.dueSubmitDate}" />
						</h:panelGrid>
						<a4j:form>
						<rich:scrollableDataTable value="#{con010.saleCommonDatas}" 
								sortMode="single" selection="#{con010.selection}" rowKeyVar="rkvar"
								var="saleProduction" 
								width="550px" height="150px" id="saleProductionTable" >
							<rich:column width="40px" styleClass="textCenter">
								<f:facet name="header">
									<h:outputText value="Status" />
								</f:facet>
								<h:graphicImage value="/images/status/#{saleProduction.colorStatus}.gif"></h:graphicImage>
								<f:facet name="footer">
									<h:outputText value=""></h:outputText>
								</f:facet>
							</rich:column>
							<rich:column>
								<f:facet name="header">
									<h:outputText value="Production No." />
								</f:facet>
								<h:outputText value="#{saleProduction.id.productionNo}" />
								<f:facet name="footer">
									<h:outputText value="Total"></h:outputText>
								</f:facet>
							</rich:column>
							<rich:column width="50px">
								<f:facet name="header">
									<h:outputText value="#{bundle.select15}" />
								</f:facet>
								<h:outputText value="#{saleProduction.quantity}" />
								<f:facet name="footer">
									<h:outputText value="#{con010.totSaleProdQty}"></h:outputText>
								</f:facet>
							</rich:column>
							<rich:column width="40px">
								<f:facet name="header">
									<h:outputText value="#{bundle.select16}" />
								</f:facet>
								<h:outputText value="#{saleProduction.uom}" />
								<f:facet name="footer">
									<h:outputText value=""></h:outputText>
								</f:facet>
							</rich:column>
							<rich:column>
								<f:facet name="header">
									<h:outputText value="#{bundle.select35}" />
								</f:facet>
								<h:outputText value="#{saleProduction.currentOperation}" />
								<f:facet name="footer">
									<h:outputText value=""></h:outputText>
								</f:facet>
							</rich:column>
							<rich:column>
								<f:facet name="header">
									<h:outputText value="#{bundle.select36}" />
								</f:facet>
								<h:outputText value="#{saleProduction.userStatus}" />
								<f:facet name="footer">
									<h:outputText value=""></h:outputText>
								</f:facet>
							</rich:column>
							<rich:column width="70px">
								<f:facet name="header">
									<h:outputText value="#{bundle.select37}" />
								</f:facet>
								<h:outputText value="#{saleProduction.totProduceQty}" />
								<f:facet name="footer">
									<h:outputText value="#{con010.totSaleProdWipQty}"></h:outputText>
								</f:facet>
							</rich:column>
							<rich:column width="70px">
								<f:facet name="header">
									<h:outputText value="#{bundle.select38}" />
								</f:facet>
								<h:outputText value="#{saleProduction.finishGoods}" />
								<f:facet name="footer">
									<h:outputText value="#{con010.totSaleProdGoodsQty}"></h:outputText>
								</f:facet>
							</rich:column>
							
							<a4j:support event="onselectionchange" action="#{con010.takeSelection}" limitToList="true" reRender="selectSaleProductionPanel"></a4j:support>
						</rich:scrollableDataTable>
						<rich:panel id="selectSaleProductionPanel">
							<h:outputText value="Selected Production No.:" styleClass="headerSubject"/>
							<h:outputText value="#{con010.selectSaleCommonData.id.productionNo}" />
							
							<rich:scrollableDataTable value="#{con010.selectSaleCommonData.routings}" var="routing" width="450px" height="200px" id="saleRoutingTable">
								<rich:column width="200px">
									<f:facet name="header">
										<h:outputText value="Operation" />
									</f:facet>
									<h:outputText value="#{routing['name']}" />
								</rich:column>
								<rich:column width="250px">
									<f:facet name="header">
										<h:outputText value="Data" />
									</f:facet>
									<h:outputText value="#{routing['data']}" />
								</rich:column>
							</rich:scrollableDataTable>
						</rich:panel>
						</a4j:form>
					</rich:panel>
				</h:panelGroup>
			</rich:modalPanel>
		</f:view>
	</body>
</html>